"Speed Analyzer Bootstrap"
Bootstrap 3.0.0 Snippet by Pawan Singhania

Post to Facebook Tweet this

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <html> <head> <title>Speed Analyzer Bootstrap</title> <style> .box { padding:50px; background:red; text-transform:uppercase; font-weight:bold; text-align:center; color:#fff; } </style> </head> <body> <div class="mb-12 tb-6 ml-8 lp-3 box"> hello world !! </div> </body> </html>
/* Design and Developed by : Pawan Singhania Email : pawansinghania001@gmail.com Website : http://bestwebdesigner.comoj.com/ Mobile : +91-8968827572 Version : 1.0; */ body{margin:0; padding:0;} div{margin: 0px; padding: 0px; float: left;} .main{width: 96%; margin:auto; padding:0px; float: none;} img{max-width: 100%;} /* For desktop */ .one-half {width:4.165%;} .lp-1 {width: 8.33%;} .lp-2 {width: 16.66%;} .lp-3 {width: 25%;} .lp-4 {width: 33.33%;} .lp-5 {width: 41.66%;} .lp-6 {width: 50%;} .lp-7 {width: 58.33%;} .lp-8 {width: 66.66%;} .lp-9 {width: 75%;} .lp-10 {width: 83.33%;} .lp-11 {width: 91.66%;} .lp-12 {width: 100%;} .form-text {width: 100%; padding: 10px; margin: 0 0 10px 0; height: 35px; border-radius:3px; border:1px solid #ccc; outline: none;} .form-text::-webkit-input-placeholder{color: #818181; font-size: 14px;} textarea{width: 100%; min-height:100px; border-radius:3px; margin: 0 0 10px 0; border:1px solid #ccc; outline: none; font-family: "arial";} textarea::-webkit-input-placeholder{color: #818181; font-size: 14px; font-family: "arial";} *{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } a{text-decoration: none; color: #3d3d3d;} .list-group{margin: 0; padding: 0; width: 100%;} .list-item{margin: 0; display: block; position: relative; background: #fff; padding:10px 0 10px 10px; border:1px solid #ccc; width: 100%;} .list-item::first-letter{text-transform: capitalize;} ul{margin:0; padding:0;} li{list-style-type: none;} /* For Mini Laptops: */ @media(max-width:1224px) and (min-width:1024px){ .one-half {width:4.165%;} .ml-1 {width: 8.33%;} .ml-2 {width: 16.66%;} .ml-3 {width: 25%;} .ml-4 {width: 33.33%;} .ml-5 {width: 41.66%;} .ml-6 {width: 50%;} .ml-7 {width: 58.33%;} .ml-8 {width: 66.66%;} .ml-9 {width: 75%;} .ml-10 {width: 83.33%;} .ml-11 {width: 91.66%;} .ml-12 {width: 100%;} } /* For Tablets: */ @media(max-width:1024px) and (min-width:786px){ .one-half {width:4.165%;} .tb-1 {width: 8.33%;} .tb-2 {width: 16.66%;} .tb-3 {width: 25%;} .tb-4 {width: 33.33%;} .tb-5 {width: 41.66%;} .tb-6 {width: 50%;} .tb-7 {width: 58.33%;} .tb-8 {width: 66.66%;} .tb-9 {width: 75%;} .tb-10 {width: 83.33%;} .tb-11 {width: 91.66%;} .tb-12 {width: 100%;} } /* For Mobile */ @media (max-width:768px) and (min-width: 240px){ .one-half {width:4.165%;} .mb-1 {width: 8.33%;} .mb-2 {width: 16.66%;} .mb-3 {width: 25%;} .mb-4 {width: 33.33%;} .mb-5 {width: 41.66%;} .mb-6 {width: 50%;} .mb-7 {width: 58.33%;} .mb-8 {width: 66.66%;} .mb-9 {width: 75%;} .mb-10 {width: 83.33%;} .mb-11 {width: 91.66%;} .mb-12 {width: 100%;} } @media (max-width:10000px) and (min-width:2800px){.main{width:30%;}} @media (max-width:5000px) and (min-width:2800px){.main{width: 35%;}} @media (max-width: 2800px) and (min-width:2500px){.main{width: 50%;}} @media (max-width: 2500px) and (min-width:2200px){.main{width: 40%;}} @media (max-width: 2200px) and (min-width:1800px){.main{width: 60%;}} @media (max-width: 1800px) and (min-width:1500px){.main{width: 80%;}}

Related: See More

Argon Design System

Questions / Comments: